<!-- 招聘小组列表 -->
<template>
	<view>
		<view class="smallgroup-box" v-for="(item,index) in items" :key="index">
			<view class="title-box flex">
				<view class="blue-l"></view>
				<view class="title-h2">{{item.name}}</view>
			</view>
			<view class="flex leader">
				<view class="title-h3">组长:</view>
				<view class="detail-h3">{{item.leader_name}}</view>
			</view>
			<view class="flex leader">
				<view class="title-h3">组员:</view>
				<view class="detail-h3 flex" v-for="(i,index1) in item.team_user" :key="index1">
					<view class="detail-h5">{{i.user_name}}</view>
				</view>
			</view>
			<view>
				<view class="">
					管理小组
				</view>
				<view class="btm-btn" @tap="handleClickTask(item.id)">
					招聘任务
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			items:{
				type:Array
			}
		},
		methods:{
			handleClickTask(id){
				// console.log(id)
				uni.navigateTo({
				    // url: '../main'
					url: '/pages/recruitment/recruitment_task'
				});
			}	
		}
	}
</script>

<style scoped lang="stylus">
	.smallgroup-box{
		height:360upx;
		width:656upx;
		background:#fff;
		margin:30upx auto;
		padding:30upx;
		.title-box{
			align-items:center;
			.blue-l{
				height:30upx;
				width:6upx;
				background:#4A90E2;
			}
			.title-h2{
				margin-left:24upx;
				font-size:36upx;
				color:#333;
				font-weight:500;
			}
		}
		.leader{
			margin-top:30upx;
			margin-bottom:40upx;
			.title-h3{
				font-size:28upx;
				color:#999999;
				margin:0 16upx;
			}
			.detail-h3{
				font-size:28upx;
				color:#666666;
				.detail-h5{
					margin-right:16upx;
				}
			}
		}
		.btm-btn{
			height:64upx;
			width:560upx;
			background:linear-gradient(270deg,rgba(27,110,238,1) 0%,rgba(53,169,255,1) 100%);
			font-size:32upx;
			color:#fff;
			text-align:center;
			line-height:64upx;
			margin:0 auto;
			border-radius:8upx;
			
		}
	}
</style>
